<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta content="initial-scale=1.0,minimum-scale=1.0,maximum=1.0,user-scalable=no,width=device-width" name="viewport">
	<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>信基沙溪</title>
	<!-- Bootstrap -->
	<link href="/xj/css/bootstrap.min.css" rel="stylesheet">
	<link href="/xj/css/jquery.gScrollingCarousel.css" rel="stylesheet"/>
	<link href="/xj/css/marketopens.css" rel="stylesheet">
	<link href="/xj/css/global.css" rel="stylesheet">
	<link href="/xj/css/style.css" rel="stylesheet">
	<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
	<!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
	<!--[if lt IE 9]>
	<script src="/xj/js/html5shiv.min.js"></script>
	<script src="/xj/js/respond.min.js"></script>
	<![endif]-->
</head>

<style>
	.search_txt{
		color: #ffffff;
		float: right;
		height: 40px;
		line-height: 40px;
		font-size: 15px;
		margin-right: 10px;
		width: 15%;
		text-align: center;
	}

	.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover{
		background-color: #ffffff;
		color:#337ab7;
		border-bottom: 2px solid #25a;
	}

	.nav{
		background-color: #ffffff;

	}

	.nav li{
		border-left: 0.1px solid #ccc;

	}

	.nav-pills>li>a{
		border-radius: 0px;
	}

	.item_img{
		width: 20px;
		margin-right: 2px;
	}

	.hot_search_txt{
		width: 100%;
		padding-left: 10px;
		background-color: #ffffff;
		margin-top: 10px;
	}

	.hot_search_txt p{
		color: #CCCED3;
		font-size: 20px;
	}

	.hot_search_txt button{
		border: 0px;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 5px;
		padding-bottom: 5px;
		background-color: #F8F8F8;
		border-radius: 3px;
		margin-bottom: 10px;
		margin-right: 5px;
	}
</style>

<body>

	 <div id="whole_box">
		<!--<div class="box" style="padding-left: 0px!important;">-->

		<!--</div>-->
		<div class="box">
			<img src="/xj/image/icon/arrow_left.png" class="back_icon" v-on:click="getback">
			<i class="index-icon-search" style="top: 77px;"></i>
			<input type="text" v-model="input_search" class="username" :placeholder="search_txt_i" style="width:80%;border: 0px;"/>
			<span class="search_txt" v-on:click="search">{{search_txt}}</span>
		</div>

		<div class="row" style="width: 100%;margin: 0 auto;">
			<!-- Nav tabs -->
			<ul class="nav nav-pills market_tab" role="tablist">
				<li role="presentation" class="active" style="width: 33.3%;margin-left: 0px;" v-on:click="changeTab(1)">
					<a href="#home" aria-controls="home" role="tab" data-toggle="tab"
					   style="font-size: 15px;padding-left: 0px;padding-right: 0px;text-align: center;">
						<image :src="tab_img1" class="item_img"></image>
						{{all_txt}}
					</a>
				</li>
				<li role="presentation" class="" style="width: 33.3%;margin-left: 0px;" v-on:click="changeTab(2)">
					<a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"
					   style="font-size: 15px;padding-left: 0px;padding-right: 0px;text-align: center;">
						<image :src="tab_img2" class="item_img"></image>
						{{brand_txt}}</a>
				</li>
				<li role="presentation" class="" style="width: 33.3%;margin-left: 0px;" v-on:click="changeTab(3)">
					<a href="#messages" aria-controls="messages" role="tab" data-toggle="tab"
					   style="font-size: 15px;padding-left: 0px;padding-right: 0px; text-align: center;">
						<image :src="tab_img3" class="item_img"></image>
						{{category_txt}}</a>
				</li>
			</ul>

			<!-- Tab panes -->
			<div class="tab-content">
				<!--全部-->
				<div id="home" role="tabpanel" class="tab-pane active" style="background: #D4D4D4;">
					<div class="hot_search_txt" v-if="search_finish">
                       <p>{{hot_search}}</p>
						<button v-for="item in all_hot" v-on:click="requestStoreQuickByName(item.enum_value)">{{item.enum_value}}</button>
					</div>

					<div  v-for="(business,index) in store_list" class="store_list" v-on:click="storDetail(business.id)">
						<div class="media" style="padding-top: 15px;" style="width: 100%;">
							<div class="media-left">
								<a href="#">
									<img class="media-object store_logo" :src="business.logo" >
								</a>
							</div>
							<div class="media-body" style="padding-top: 10px; width: 100%;">
								<h4 class="media-heading" style="font-family: '微软雅黑';font-weight: bold;">
									{{business.store_name}}</h4>
								<img src="/xj/image/store/sell_logo.png" style="width: 5%;"/>
								<font style="font-size: 10px;">{{main_pro_txt}}:{{business.mainlabel}}</font>
							</div>
						</div>
						<!--滑动图片区域-->

						<div class="g-scrolling-carousel scrollstyle">
							<div class="items">
								<a v-for="(dataItem,index2) in business.product_show_pic" href="#" style="">
									<img :src="dataItem.url" style="width: 50%;height: 100px;padding-right: 8px"></a>

							</div>
						</div>
					</div>

					<div class="bottom_line">---------我是有底线的---------</div>
				</div>

				<!--商家名称-->
				<div id="profile" role="tabpanel" class="tab-pane" style="background-color:#D4D4D4 ;">
					<div class="hot_search_txt" v-if="search_finish">
						<p>{{hot_search}}</p>
						<button v-for="item in store_hot"  v-on:click="requestStoreQuickByName(item.enum_value)">{{item.enum_value}}</button>
					</div>

					<div  v-for="(business,index) in store_name_list" class="store_list" v-on:click="storDetail(business.id)">
						<div class="media" style="padding-top: 15px;" style="width: 100%;">
							<div class="media-left">
								<a href="#">
									<img class="media-object store_logo" :src="business.logo" >
								</a>
							</div>
							<div class="media-body" style="padding-top: 10px; width: 100%;">
								<h4 class="media-heading" style="font-family: '微软雅黑';font-weight: bold;">
									{{business.store_name}}</h4>
								<img src="/xj/image/store/sell_logo.png" style="width: 5%;"/>
								<font style="font-size: 10px;">{{main_pro_txt}}:{{business.mainlabel}}</font>
							</div>
						</div>
						<!--滑动图片区域-->

						<div class="g-scrolling-carousel scrollstyle">
							<div class="items">
								<a v-for="(dataItem,index2) in business.product_show_pic" href="#" style="">
									<img :src="dataItem.url" style="width: 50%;height: 100px;padding-right: 8px"></a>

							</div>
						</div>
					</div>

					<div class="bottom_line">---------我是有底线的---------</div>
				</div>

				<!--品类搜索-->
				<div id="messages" role="tabpanel" class="tab-pane" style="background: #D4D4D4;">
					<div class="hot_search_txt"  v-if="search_finish">
						<p>{{hot_search}}</p>
						<button v-for="item in category_hot"  v-on:click="requestStoreQuickByCategory(item.enum_value)">{{item.enum_value}}</button>
					</div>

					<div  v-for="(business,index) in store_category_list" class="store_list" v-on:click="storDetail(business.id)">
						<div class="media" style="padding-top: 15px;" style="width: 100%;">
							<div class="media-left">
								<a href="#">
									<img class="media-object store_logo" :src="business.logo" >
								</a>
							</div>
							<div class="media-body" style="padding-top: 10px; width: 100%;">
								<h4 class="media-heading" style="font-family: '微软雅黑';font-weight: bold;">
									{{business.store_name}}</h4>
								<img src="/xj/image/store/sell_logo.png" style="width: 5%;"/>
								<font style="font-size: 10px;">{{main_pro_txt}}:{{business.mainlabel}}</font>
							</div>
						</div>
						<!--滑动图片区域-->

						<div class="g-scrolling-carousel scrollstyle">
							<div class="items">
								<a v-for="(dataItem,index2) in business.product_show_pic" href="#" style="">
									<img :src="dataItem.url" style="width: 50%;height: 100px;padding-right: 8px"></a>

							</div>
						</div>
					</div>

					<div class="bottom_line">---------我是有底线的---------</div>
				</div>
			</div>

		</div>
	 </div>
</body>

</html>
<script src="/xj/js/jquery.min.js"></script>
<script src="/xj/js/jquery.gScrollingCarousel.js"></script>
<script src="/xj/js/bootstrap.min.js"></script>
<script src="/xj/js/vue.min.js"></script>
<script src="/xj/javascript/search.js"></script>

<style>
	.box{
		padding-left: 0px!important;
	}

	.back_icon {
		float: left;
	}

	.box .username{
		width: 70%!important;
	}

	.bottom_line{
		text-align: center;
		background-color: #ffffff;
		color:#A4A4A4 ;
	}
</style>